<!--
Copyright (C) 2020 Yoann QUERET <yoann@queret.net>
-->

<!--
This file is part of ODR-EncoderManager.

ODR-EncoderManager is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

ODR-EncoderManager is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with ODR-EncoderManager.  If not, see <http://www.gnu.org/licenses/>.
-->

<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>ODR - Encoder Manager</title>

	<!-- jquery -->
	<script src="/js/jquery.js"></script>
	
	<!-- Bootstrap -->
	<link href="/css/bootstrap.min.css" rel="stylesheet">
	<script src="/js/bootstrap.min.js"></script>
	
	<style>
		#loginbox {
			margin-top: 30px;
		}

		#loginbox > div:first-child {
			padding-bottom: 10px;
		}

		.iconmelon {
			display: block;
			margin: auto;
		}

		#form > div {
			margin-bottom: 25px;
		}

		#form > div:last-child {
			margin-top: 10px;
			margin-bottom: 10px;
		}

		.panel {
			background-color: transparent;
		}

		.panel-body {
			padding-top: 30px;
			background-color: rgba(2555,255,255,.3);
		}
	</style>
</head>

<body>
	{% include 'body-nav.html' %}

	<div class="container-fluid">
		<div id="loginbox" class="mainbox col-md-6 col-md-offset-3 col-sm-6 col-sm-offset-3"> 
		<div class="panel panel-default" >
			<div class="panel-heading">
				<div class="panel-title text-center">{{ msg }}</div>
			</div>

			<div class="panel-body" >

				<form name="form" id="form" class="form-horizontal" enctype="multipart/form-data" method="POST">
					<input type="hidden" name="from_page" value="{{ from_page }}" />
					<div class="input-group">
						<span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span>
						<input id="user" type="text" class="form-control" name="username" placeholder="User" value="{{ username }}">                                        
					</div>

					<div class="input-group">
						<span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span>
						<input id="password" type="password" class="form-control" name="password" placeholder="Password">
					</div>

					<div class="form-group">
						<!-- Button -->
						<div class="col-sm-12 controls">
							<button type="submit" href="#" class="btn btn-primary pull-right"><i class="glyphicon glyphicon-log-in"></i> Log in</button>                          
						</div>
					</div>

				</form>

			</div>
		</div>
		</div>
	</div>

<script type="text/javascript">
	$( "#user" ).focus();
</script>

</body>

</html>
